<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <script src="assets/js/jquery.min.js"></script>
    <link rel="stylesheet" href="assets/css/bootstrap.min.css">
    <link rel="stylesheet" href="assets/js/bootstrap.min.js">
    <!-- 导航菜单 -->
    <link rel="stylesheet" href="assets/css/normalize.css" media="screen">
    <link rel="stylesheet" href="assets/css/basic-styles.css" media="screen">
    <link rel="stylesheet" href="assets/css/header.css" media="screen">
    <link rel="stylesheet" href="assets/css/okayNav-base.css" media="screen">
    <link rel="stylesheet" href="assets/css/okayNav-theme.css" media="screen">
    <!--[if IE]>
        <script src="http://libs.useso.com/js/html5shiv/3.7/html5shiv.min.js"></script>
    <![endif]-->
    <script src="assets/js/jquery.okayNav.js"></script>

    <!-- 侧边菜单 -->
    <link rel="stylesheet" type="text/css" href="assets/css/sui.nav.css" />
    <script src="assets/js/sui.nav.min.js" type="text/javascript" charset="utf-8"></script>

    <!-- markdown 文件解析 -->
    <script src="assets/js/marked.min.js" type="text/javascript" charset="utf-8"></script>

    <!-- 模态框 -->
    <script src="assets/js/modal.js" type="text/javascript" charset="utf-8"></script>

    <!-- 自定义样式 -->
    <link rel="stylesheet" href="assets/css/main.css">
    <link rel="stylesheet" href="assets/css/token.css">

    <script src="assets/js/token.js"></script>

<style type="text/css">
    .modal-dialog {
        margin-top: 15%;
    }

    .modal-body {
        text-align: center;
    }

    .modal-body h1 {
        font-weight: bold;
        color: #ACACAC;
        margin-top: 51px;
        margin-bottom: 13px;
        font-size: 39px;
    }

    .modal-body p {
        color: #7C7C7C;
        font-size: 16px;
        margin-bottom: 15px;

    }

    .modal-body span {     
        float: right;
        margin-right: 15%;
        font-size: 12px;
    }


    .modal-body a {     
        color: #4F729D;
    }

    .modal-body input {
        width: 70%;
        margin-left: 15%;
    }

    .modal-body button {
        display: block;
        width: 50%;
        margin-left: 25%;
        background-color: #FFB847;
        border: none;
        color: #4E729A;
        margin-top: 50px;
        margin-bottom: 25px;
        padding: 12px;
        border-radius: 25px;
        font-size: 16px;
    }
    footer a:hover {
        color: #ffffff;
    }

    .downlaod {
        display: block;
        margin-left: 5%;
        text-align: center;
        background: linear-gradient(to bottom, #4C8DC2 0%,#255C9C 100%);
        color: #ffffff;
        border: none;
        padding: 10px 25px;
        font-size: 16px;
        border-radius: 6px;
        /*font-family: fantasy;*/
        margin-bottom: 30px;

    }

    .downlaod img {
        height: 23px;
        margin-right: 11px;
    }
</style>
</head>
<body>
    <header id="header" class="okayNav-header">
            <a class="okayNav-header__logo" href="/index.html">
            <img src="assets/img/logo.png" alt="placeholder+image">
        </a>

        <nav role="navigation" id="nav-main" class="okayNav">
            <ul>
                <li><a href="/index.html">主页</a></li>
                <li><a class="getToken">下载 SDK</a></li>
                <li><a href="/token_en.html">English</a></li>
            </ul>
        </nav>
    </header>

        <div class="container ">
            <div class="nav-second">
                <div id="sui_nav" class="sui-nav">
                    <button class="downlaod getToken"><img src="assets/img/download.png">点击下载</button>
                    <div class="sui-nav-wrapper nav-border nav-line">
                        <ul>
                            <li  data-id="-android-studio-wifisdk-">
                                <a class="text-primary" >
                                    一、快速集成
                                </a>
                            </li>
                            <li  data-id="-titlt-2-title-">
                                <a class="text-primary" >
                                    二、添加引用
                                </a>
                            </li>
                            <li data-id="-token-titlt-3-title-">
                                <a class="text-primary" >
                                    三、设置 Token
                                </a>
                            </li>
                            <li data-id="-titlt-4-title-">
                                <a class="text-primary" >
                                    四、权限添加
                                </a>
                            </li>
                            <li data-id="-wifisdk-titlt-5-title-">
                                <a class="text-primary" >
                                    五、启动 WIFI 界面
                                </a>
                            </li>
                            <li data-id="-wifi-titlt-6-title-">
                                <a class="text-primary" >
                                    六、启动WiFi界面
                                </a>
                            </li>
                            <li data-id="-titlt-7-title-">
                                <a class="text-primary" >
                                    七、自定义通知
                                </a>
                                
                            </li>
                            <li data-id="-ui-titlt-8-title-">
                                <a class="text-primary" >
                                    八、自定义UI
                                </a>
                                <ul>
                                    <li data-id="8-1-wifi-"><a href="#">返回箭头的点击事件</a></li>
                                    <li data-id="8-2-wifi-tab-"><a href="#">Tab 字体颜色</a></li>
                                    <li data-id="8-3-wifi-"><a href="#">页面背景色</a></li>
                                    <li data-id="8-4-wifi-ui-"><a href="#">检测结果页 UI 样式</a></li>
                                </ul>

                            </li>
                            <li data-id="-titlt-9-title-">
                                <a class="text-primary" >
                                    九、混淆
                                </a>
                                
                            </li>
                            
                        </ul>
                    </div>

                    <script type="text/javascript">
                        $(document).ready(function() {
                            // 加载md文件
                            $.get("./assets/md/sdk.md", function(response, status, xhr){ 
                                $("#body_content")[0].innerHTML = marked(response); 
                            });

                            $("li").on("click", function() {
                                console.log($(this).data("id"));
                                window.location.href = "#" + $(this).data("id");
                            })
                        })


                    </script>

                </div>
            </div>
            <div class="body">
                <p class="menu_btn">
                    <button class="MenuToggle btn btn-default">菜单</button>
                </p>
                <div id="body_content">
                </div>
            </div>
        </div>

<div id="myModal1" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="gridSystemModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-body">
        <h1>获取TOKEN</h1>
        <p>每个邮箱只能获取一个TOKEN</p>
        <input type="text" class="form-control" placeholder="请输入您的邮箱">
        <span><a href="">已经获取过TOKEN</a></span>
        <button class="getTokenBtn">获取</button>
      </div>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<div id="myModal2" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="gridSystemModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-body">
        <h1>填写邮箱</h1>
        <p>
            留下邮箱以便获得SDK最新动向并获取token
        </p>
        <input type="text" id="dmail" class="form-control" placeholder="请输入您的邮箱">
        <!-- <span>没有收到来自Weshare WiFi SDK的邮件？<a href="">换个邮箱</a>或者<a href="">重发邮件</a></span> -->
        <button class="downloadSDKBtn">下载SDK</button>
      </div>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->


    <!-- <footer>
        <span>@2011-2017</span>
        <a href="token_en.html">English</a>
        <a href="/license.html">SDK使用授权许可协议</a>
        <a href="/contact.html">联系我们</a>
    </footer> -->
    
</body>


</html>